<section>
  <div class="btn-group g-dropdown" dDropDown (toggleEvent)="onToggle($event)">
    <a dDropDownToggle class="devui-dropdown-default devui-dropdown-origin">
      更多操作
      <span class="icon-chevron-down"></span>
    </a>

    <ul dDropDownMenu class="devui-dropdown-menu devui-dropdown-overlay" role="menu">
      <li role="menuitem">
        <input type="text" class="devui-input devui-input-sm devui-search-in-dropdown" placeholder="输入框" />
        <div class="icon-in-search">
          <i class="icon icon-search"></i>
        </div>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">禁用选项</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">新建</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">删除</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单一</a>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">菜单二</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单三</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单四</a>
      </li>
    </ul>
  </div>
</section>
<section>
  <div class="btn-group g-dropdown" dDropDown (toggleEvent)="onToggle($event)">
    <a dDropDownToggle class="devui-dropdown-no-border devui-dropdown-origin">
      更多操作
      <span class="icon-chevron-down"></span>
    </a>

    <ul dDropDownMenu class="devui-dropdown-menu devui-scrollbar devui-dropdown-overlay" role="menu">
      <li role="menuitem">
        <input type="text" class="devui-input devui-input-sm devui-search-in-dropdown" placeholder="输入框" />
        <div class="icon-in-search">
          <i class="icon icon-search"></i>
        </div>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">禁用选项</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">新建</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">删除</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单一</a>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">菜单二</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单三</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单四</a>
      </li>
    </ul>
  </div>
</section>
<section>
  <h5>附着到body上防止被滚动条遮挡</h5>
  <div class="btn-group g-dropdown" dDropDown appendToBody (toggleEvent)="onToggle($event)">
    <a dDropDownToggle class="devui-dropdown-default devui-dropdown-origin">
      更多操作
      <span class="icon-chevron-down"></span>
    </a>

    <ul dDropDownMenu class="devui-dropdown-menu devui-scrollbar devui-dropdown-overlay" role="menu">
      <li role="menuitem">
        <input type="text" class="devui-input devui-input-sm devui-search-in-dropdown" placeholder="输入框" />
        <div class="icon-in-search">
          <i class="icon icon-search"></i>
        </div>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">禁用选项</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">新建</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">删除</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单一</a>
      </li>
      <li class="disabled" role="menuitem">
        <a class="devui-dropdown-item disabled">菜单二</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单三</a>
      </li>
      <li role="menuitem">
        <a class="devui-dropdown-item">菜单四</a>
      </li>
    </ul>
  </div>
</section>
